<template>
	<view class="">
		<view class="sticky w-1 fr-b-c" style="background: #f1f5f6; padding: 20rpx 30rpx;">
			<picker mode="date" fields="day" @change="changeStart">
				<view class="dbox relative fr-b-c">
					<input v-model="start_time" type="text" class="flex-1 fs-28" placeholder="年/月/日" />
					<image style="width: 31rpx; height: 31rpx;" src="/static/images/tab4/calendar.png" mode=""></image>
					<view class="w-1 h-1 absolute-0"></view>
				</view>
			</picker>
			<text class="c-33 fs-26">~</text>
			<picker mode="date" fields="day" @change="changeDate">
				<view class="dbox relative fr-b-c">
					<input v-model="end_time" type="text" class="flex-1 fs-28" placeholder="年/月/日" />
					<image style="width: 31rpx; height: 31rpx;" src="/static/images/tab4/calendar.png" mode=""></image>
					<view class="w-1 h-1 absolute-0"></view>
				</view>
			</picker>
		</view>
		<view class="w-1 relative fl-s-c">
			<view class="relative w-1 p-r-30">
				<view class="w-1 white-box" style="padding: 0 25rpx;">
					
					<view class="fl-b-s" :class="index==list.length-1?'':'bb-solid'" v-for="(item,index) in list" :key="index" style="min-height: 150rpx; padding: 25rpx 0;">
						<view class="w-1 fr-b-c">
							<text class="c-33 fs-28 bold">{{item.title}}</text>
							<text class="c-33 fs-28 bold">{{item.pm==1?'+':'-'}}￥{{item.number}}</text>
						</view>
						<view class="w-1 fl-s-s m-t-20">
							<text class="c-33 fs-28">{{$u.timeFormat(item.createtime,'yyyy-mm-dd hh:MM:ss')}}</text>
							<!-- <text class="c-77 fs-24 m-t-20" v-if="item.mark">订单号：{{item.mark}}</text> -->
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="w-1 p-t-150" v-if="nodata">
			<up-empty :icon="$icon"></up-empty>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				page:1,
				list:[],
				nodata:false,
				loadmore:true,
				money:0,
				end_time:'',
				start_time:''
			}
		},
		onLoad() {
			// this.end_time = uni.$u.timeFormat(Date.now(), 'yyyy-mm-dd');
			this.getlist()
		},
		onReachBottom() {
			if(this.loadmore){
				this.page++;
				this.getlist()
			}
		},
		onPullDownRefresh() {
			this.getlist()
		},
		methods: {
			changeStart(e){
				this.start_time=e.detail.value
				this.page = 1
				this.list = []
				this.getlist()
			},
			changeDate(e){
				this.end_time=e.detail.value
				this.page = 1
				this.list = []
				this.getlist()
			},
			toWithdrawal(){
				uni.navigateTo({
					url:'./Withdrawal'
				})
			},
			getlist(){
				uni.$get({
					url:'/api/User/myDiamonds',
					data:{
						page:this.page,
						// type:3,
						// lt_type:1,
						start_time:this.start_time,
						end_time:this.end_time
					}
				}).then(res=>{
					this.list = this.page==1?res.data.lst:[...this.list,...res.data.lst];
					this.nodata = !this.list.length;
					this.loadmore = res.data.length;
				}).catch(err=>{
					this.list = [];
					this.nodata = true;
					this.loadmore = true;
				})
			},
		}
	}
</script>

<style>
page{
	background: #f1f5f6;
}
.dbox{
	padding: 0 24rpx;
	width: 320rpx;
	height: 80rpx;
	background: #FFFFFF;
	border-radius: 12rpx 12rpx 12rpx 12rpx;
}

.fixed-0{
	background: linear-gradient(to bottom,#D2FFFB,#FCFCFC);
	background-size: 750rpx 442rpx;
}
.tinfo{
	background: linear-gradient(to bottom,#D2FFFB,#FCFCFC);
	background-size: 750rpx 442rpx;
	height: 442rpx;
}

.tw-box{
	padding: 0 20rpx;
	width: 686rpx;
	height: 276rpx;
	background: #FFFFFF;
	box-shadow: 0rpx 0rpx 12rpx 2rpx #F1F1F1;
	border-radius: 24rpx 24rpx 24rpx 24rpx;
}

.white-box{
	width: 686rpx;
	background: #FFFFFF;
	box-shadow: 0rpx 0rpx 12rpx 2rpx #F1F1F1;
	border-radius: 24rpx 24rpx 24rpx 24rpx;
}
</style>
